//
//  MyView.swift
//  imprint
//
//  Created by 小柠檬🍋 on 2024/12/26.
//

import SwiftUI
//统计试图
struct StatisticsView: View {
    @EnvironmentObject var themeManager: ThemeManager
    @State var tableItem : [StatisticsBean] = []
    @State private var selectId = UUID()
    @State private var initView = false
    
    var body: some View {
        ZStack{
            BackgroundView(isMain: true)
            VStack(alignment: .leading, spacing: 10) {
                Text("统计")
                    .font(.title)
                    .padding(.horizontal, 30)
                    .fontWeight(.bold)
                classsifyView
                    .padding(.horizontal, 30)
                pageView
                Spacer()
            }
        }.frame(maxWidth: .infinity,maxHeight: .infinity)
            .background(.bg)
            .onChange(of: userManager.isLoginSuc) { value in
                updateView()
            }
            .onChange(of: BackupsManager.shared.backupsType) { value in
                updateView()
            }.onAppear{
                if !initView {
                    updateView()
                    initView = true
                }
            }
    }
    
    //刷新界面
    func updateView(){
        self.tableItem = [StatisticsBean("日历"),StatisticsBean("心情"),StatisticsBean("标签")]
        self.selectId = tableItem.first?.id ?? UUID()
    }
}

extension StatisticsView {
    //标签分类
    var classsifyView: some View {
        ScrollView(.horizontal,showsIndicators: false) {
            VStack(alignment: .leading, spacing: 0) {
                //滚动试图（通过HStack监听selectIndex 变化，实现滚动标签）
                ScrollViewReader { value in
                    //横向布局
                    HStack(spacing: 20) {
                        ForEach(tableItem, id: \.id) { item in
                            //文本
                            Text(item.title)
                                .font(.system(size: 16))
                                .foregroundColor(themeManager.themeColor)
                                .padding(.horizontal, 10)
                                .padding(.vertical, 5)
                                .background(themeManager.themeColor.opacity(0.2))
                                .cornerRadius(5)
                                .opacity(item.id == selectId ? 1 : 0.6)
                                .contentShape(Rectangle())
                                .onTapGesture {
                                    withAnimation {
                                        self.selectId = item.id
                                    }
                                }
                            
                        }
                    }.onChange(of: selectId) { newValue in
                        let selectIndex = tableItem.firstIndex(where: { $0.id == newValue })
                        withAnimation(Animation.linear(duration: 2)) { //加个动画，标题滚动到中间才不会生硬
                            value.scrollTo(selectIndex,anchor: .center)
                        }
                    }
                    
                }
            }
        }
        
    }
}

extension StatisticsView{
    private var pageView : some View {
        
        TabView(selection: $selectId) { //使用selection 就会跟$selectIndex绑定
            ForEach(tableItem, id: \.id) { item in
                switch item.title {
                case "日历":
                    StatisticsDiaryView()
                        .tag(item.id)
                case "心情":
                    StatisticsMoodView()
                        .tag(item.id)
                default:
                    StatisticsTagView()
                        .tag(item.id)
                }
            }
            
        }.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))//使用PageTabViewStyle风格
    }
}

//#Preview {
//    StatisticsView()
//}

//定义预览提供者
struct StatisticsView_Previews: PreviewProvider {
    static var previews: some View {
        //使用预览共享配置
        configurePreviewEnvironment(for: StatisticsView())
    }
}
